<template>
	<view class="main">
		<zmm-watermark :watermark="watermark"></zmm-watermark>
		<h2>账号与安全</h2>
		<!-- <view class="msg">修改密码后,需要重新登录</view> -->
		<ul class="info">
			<li @tap="upload">
				<view class="msg">
					我的头像
				</view>
				<view class="avatar">
					<image :src="seleUrl" mode=""></image>
				</view>
				<image class="right" src="@/static/img/right.png" mode=""></image>
			</li>
			<li>
				<view class="msg">
					姓名
				</view>
				<view class="txt">
					{{ userInfo.nickname }}
				</view>
			</li>
			<li>
				<view class="msg">
					手机号
				</view>
				<view class="txt">
					{{ userInfo.mobile }}
				</view>
			</li>
			<li @tap="routerTo('/pages/pageB/data/chepsd')">
				<view class="msg">
					修改密码
				</view>
				<view class="txt">
					
				</view>
				<image class="right" src="@/static/img/right.png" mode=""></image>
			</li>
		</ul>
		<view class="btn" v-if="isConfirm">
			<view class="in" @tap="confirm">
				确认修改
			</view>
		</view>
	</view>
</template>

<script>
	import {
		innerinfo,
		profile,
		upload
	} from '@/api/inner.js'
export default {
	data() {
		return {
			userInfo:'',
			isConfirm:false,
			watermark:'',
			seleUrl:''
		};
	},
	onLoad() {
		this.getUserInfo()
		this.watermark = uni.getStorageSync('watermark')
	},
	methods: {
		routerTo(url){
			uni.navigateTo({
				url:url
			})
		},
		async confirm() {
			let res = await profile({
				nickname:this.nickname,
				avatar:this.seleUrl
			})
			if(res.code == 1){
				uni.showToast({
					title:'修改成功',
					icon:'none'
				})
				setTimeout(() => {
					uni.redirectTo({
						url:'/pages/pageB/data/setUp'
					})
				},1000)
			}else{
				uni.showToast({
					title:res.msg,
					icon:'none'
				})
			}
		},
		upload() {
			uni.chooseImage({
				count: 1,
				sourceType: ['album'], //从相册选择
				success: (res) => {
					console.log(res)
					this.seleUrl = res.tempFilePaths[0]
					this.isConfirm = true
					this.uploadFilePromise(this.seleUrl)
				}
			})
		},
		uploadFilePromise(url) {
			return new Promise((resolve, reject) => {
				let a = uni.uploadFile({
					url: 'https://app.guoshangufen.com/company/common/upload',
					filePath: url,
					name: 'file',
					header: {
						'token': uni.getStorageSync('token') //自定义请求头信息 
					},
					formData: {
						user: 'test'
					},
					success: (res) => {
						console.log(res)
						res.data = JSON.parse(res.data)
						this.seleUrl = res.data.data.fullurl
					}
				});
			})
		},
		async getUserInfo(){
			let res = await innerinfo()
			this.userInfo = res.data
			this.seleUrl = res.data.avatar
		},
	}
};
</script>

<style lang="scss" scoped>
.main {
	padding: 30px 15px 0;
	h2 {
		font-size: 26px;
		color: #232323;
		font-weight: 700;
		margin-bottom: 15px;
	}
	.info{
		width: 100%;
		background-color: #fff;
		margin-bottom: 15px;
		li{
			display: flex;
			justify-content: space-between;
			align-items: center;
			padding: 10px 10px;
			color: #3D3D3D;
			position: relative;
			.avatar{
				image{
					width: 30px;
					height: 30px;
					border-radius: 100px;
				}
			}
			.txt{
				color: #3D3D3D;
			}
			.msg{
				margin-right: 20px;
			}
			.right{
				width: 15px;
				height: 15px;
				position: absolute;
				right: 10px;
			}
		}
		li:first-child{
			padding-right: 30px;
		}
	}
	.btn{
		width: 100%;
		padding: 0 50px;
		.in{
			width: 100%;
			padding: 16px;
			text-align: center;
			color: #fff;
			background-color: #0C80FB;
			border-radius: 100px;
		}
	}
}
</style>
